@use 'breakpoint' as *;

// Atkinson Hyperlegible font faces
@font-face {
  font-style: normal;
  font-weight: 400;
  src:
    local('Atkinson Hyperlegible Regular'),
    local('AtkinsonHyperlegible-Regular'),
    url('/fonts/AtkinsonHyperlegibleNext-Regular.woff2') format('woff2');
  font-family: 'Atkinson Hyperlegible';
  font-display: swap;
}

@font-face {
  font-style: italic;
  font-weight: 400;
  src:
    local('Atkinson Hyperlegible Italic'),
    local('AtkinsonHyperlegible-Italic'),
    url('/fonts/AtkinsonHyperlegibleNext-RegularItalic.woff2') format('woff2');
  font-family: 'Atkinson Hyperlegible';
  font-display: swap;
}

@font-face {
  font-style: normal;
  font-weight: 700;
  src:
    local('Atkinson Hyperlegible Bold'),
    local('AtkinsonHyperlegible-Bold'),
    url('/fonts/AtkinsonHyperlegibleNext-Bold.woff2') format('woff2');
  font-family: 'Atkinson Hyperlegible';
  font-display: swap;
}

@font-face {
  font-style: italic;
  font-weight: 700;
  src:
    local('Atkinson Hyperlegible Bold Italic'),
    local('AtkinsonHyperlegible-BoldItalic'),
    url('/fonts/AtkinsonHyperlegibleNext-BoldItalic.woff2') format('woff2');
  font-family: 'Atkinson Hyperlegible';
  font-display: swap;
}

// Additional weights
@font-face {
  font-style: normal;
  font-weight: 300;
  src:
    local('Atkinson Hyperlegible Light'),
    local('AtkinsonHyperlegible-Light'),
    url('/fonts/AtkinsonHyperlegibleNext-Light.woff2') format('woff2');
  font-family: 'Atkinson Hyperlegible';
  font-display: swap;
}

@font-face {
  font-style: italic;
  font-weight: 300;
  src:
    local('Atkinson Hyperlegible Light Italic'),
    local('AtkinsonHyperlegible-LightItalic'),
    url('/fonts/AtkinsonHyperlegibleNext-LightItalic.woff2') format('woff2');
  font-family: 'Atkinson Hyperlegible';
  font-display: swap;
}

@font-face {
  font-style: normal;
  font-weight: 500;
  src:
    local('Atkinson Hyperlegible Medium'),
    local('AtkinsonHyperlegible-Medium'),
    url('/fonts/AtkinsonHyperlegibleNext-Medium.woff2') format('woff2');
  font-family: 'Atkinson Hyperlegible';
  font-display: swap;
}

@font-face {
  font-style: italic;
  font-weight: 500;
  src:
    local('Atkinson Hyperlegible Medium Italic'),
    local('AtkinsonHyperlegible-MediumItalic'),
    url('/fonts/AtkinsonHyperlegibleNext-MediumItalic.woff2') format('woff2');
  font-family: 'Atkinson Hyperlegible';
  font-display: swap;
}

@font-face {
  font-style: normal;
  font-weight: 600;
  src:
    local('Atkinson Hyperlegible SemiBold'),
    local('AtkinsonHyperlegible-SemiBold'),
    url('/fonts/AtkinsonHyperlegibleNext-SemiBold.woff2') format('woff2');
  font-family: 'Atkinson Hyperlegible';
  font-display: swap;
}

@layer base {
  p {
    text-wrap: pretty;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: var(--font-heading);
    text-wrap: balance;
  }

  h1,
  h2 {
    font-weight: 600;
  }

  h3,
  h4,
  h5,
  h6 {
    font-weight: 500;
  }

  h1 {
    font-size: var(--font-size-6);
    line-height: var(--font-size-7);
  }

  h2 {
    font-size: var(--font-size-5);
    line-height: var(--font-size-6);
  }

  h3 {
    font-size: var(--font-size-4);
    line-height: var(--font-size-5);
  }

  h4 {
    font-size: var(--font-size-3);
    line-height: var(--font-size-4);
  }

  h5 {
    font-size: var(--font-size-2);
    line-height: var(--font-size-3);
  }

  h6 {
    font-size: var(--font-size-1);
    line-height: var(--font-size-2);
  }
}
